<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="nMask tools">
<meta name="author" content="nMask">

<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">  
<link rel="shortcut icon" href="/static/favicon.ico">
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>

<title>{% block title %}nMask's Tool - 风凌渡口{% endblock %}</title>

</head>
<body>

<!-- 顶部导航 -->
<nav class="navbar navbar-default" role="navigation">
	<div class="container-fluid"> 
		<div class="navbar-header">
			<button type="button" class="navbar-toggle" data-toggle="collapse"
					data-target="#example-navbar-collapse">
				<span class="sr-only">切换导航</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="/index/">nMask's Tool - 风凌渡口</a>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</div>
		<div class="collapse navbar-collapse" id="example-navbar-collapse">
			<ul class="nav navbar-nav navbar-default">
				<li><a class="action" href="{% url 'index' %}">全部工具</a></li>
				<li><a href="{% url 'index' %}?tool_type=kf">开发类工具</a></li>
				<li><a href="{% url 'index' %}?tool_type=sec">安全类工具</a></li>
				<li><a href="{% url 'index' %}?tool_type=yw">运维类工具</a></li>
				<li><a href="{% url 'index' %}?tool_type=ctf">CTF类工具</a></li>

				<form action="/search/" class="navbar-form navbar-left" role="search" method="post">
				{% csrf_token %}
				<div class="form-group">
					<input type="text" class="form-control" name="toolname" placeholder="Search工具">
					<button type="submit" class="btn btn-default">提交</button>
				</div>
				
				</form>
			</ul>
			<ul class="nav navbar-nav navbar-right">
		        <li><a href="https://thief.one" target="_blank">技术博客</a></li>
		        <li><a href="http://home.nmask.cn">关于我</a></li>
		        <li><a href="{% url 'comment' %}">留言</a></li>
		    </ul>
		</div>
	</div>
</nav>

<!-- 模态框（Modal） -->
{% block modal %}
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					&times;
				</button>
				<h4 class="modal-title" id="myModalLabel">
					友情提醒一下
				</h4>
			</div>
			<div class="modal-body">
				非常抱歉，亲！～ 此工具暂未对外开放，请耐心等待，也可留言反馈，多谢您的支持！
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
			</div>
		</div>
	</div>
</div>
{% endblock %}

<!-- 内容 -->
{% block content %}

<script>
$.ajaxSetup({
    data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
});
</script>
<br>
<div class="container">
  <div class="row">
  	{% for i in tools_list %}
	    <div class="col-md-3">
	    	<div class="list-group">

		    	<a href="{{i.3}}" data-toggle="modal" data-target="{{i.3}}" class="list-group-item {{i.7}}">
		    		<span class="badge">{{i.9}}</span>
		    		<span class="badge">{{i.10}}</span>
			     	<h4 class="list-group-item-heading">{{i.1}}</h4>
			    </a>
		   	 	<form class="list-group-item"> 
		   	 		<a id="{{i.0}}" href="#"><span class="glyphicon glyphicon-thumbs-up"></span>点赞</a>
		   	 		：<span id="{{i.0}}_result">{{i.4}}</span>&nbsp;&nbsp;&nbsp;&nbsp;工具类别：
		   	 		<a href="{% url 'index' %}?tool_type={{i.5}}">{{i.6}}</a>
		   	 	</form>
			     <p class="list-group-item">{{i.2}}</p>
			     <p class="list-group-item"><a class="btn btn-default" data-toggle="modal" data-target="{{i.3}}" href="{{i.3}}" role="button">进入详览</a>&nbsp;&nbsp;上线时间：{{i.8}}</p>
		   	</div>
	   </div>
		<script>
		    $(document).ready(function(){
		      $("#{{i.0}}").click(function(){
		        $.post("{% url 'dianzan' %}",{'modename':"{{i.0}}"}, function(ret){
		            $('#{{i.0}}_result').html(ret)
		        })
		      });

		    });
		</script>
	{% endfor %}
  </div>
</div>
{% endblock %}


{% block fenye %}
<!-- 分页 -->
<div class="container">
	<ul class="pagination pagination-lg">
	    <li><a href="/index/?page=1">&laquo;</a></li>

	    {% for i in page_list %}
	    <li><a href="/index/?page={{ i }}">{{ i }}</a></li>
	    {% endfor %}

	    <li><a href="/index/?page={{ last_page }}">&raquo;</a></li>
	</ul>
</div>
{% endblock %}

{% block comment %}
{% endblock %}

<div class="container">
	<span class="help-block">
		{% block down %}{% endblock %}
	</span>
</div>

<br><br><br>
<!-- 底部版权说明 -->
<div class="container">
	<footer class="navbar-fixed-bottom">
		<hr>
		<div align="center">
			<p><font size="4">&copy; 2017 By nMask</font></p>
		</div>
	</footer>
</div>

<!-- 底部加载js -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>